<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no" />
    <title>我的消费码</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <!-- <link rel="stylesheet" type="text/css" href="../css/style.css" /> -->
    <style>
        body{
            font-size: 14px;
        }
        footer.aui-nav{
            z-index: 99999;
        }
        header.aui-bar{
            background: #fff;
        }
        .aui-title{
            color:#000;
        }
        .aui-nav .aui-bar-tab .active .aui-iconfont, .aui-nav .aui-bar-tab .active p{
            color:#ff3333 !important;
        }
        .active{
            color:#ff3333 !important;
        }
        .aui-tab-nav li.active {
            color: #ff3333;
            border-bottom: 2px #ff3333 solid;
        }
        .aui-bar .aui-iconfont{
            color:#000;
        }
        .my-list{
            width: 100%;
            text-align: center;
            overflow: hidden;
            margin: 0;
            color: #000;
        }
        .haderUl li:after{
            border: none !important;
        }
        .my-list li{
            padding: 0 15px;

        }
        .my-list li span{
            float: left;
            display: block;

        }
        .my-list li span{
            width: 50%;
            text-overflow: ellipsis;
            white-space:nowrap;
            overflow: hidden;
            text-align: center;

        }
        .my-list li{
            line-height: 45px;
            height: 45px;
            font-size: 12px;
        }
    </style>
</head>
<body>
<header class="aui-bar aui-bar-nav aui-border-b">
    <div class="aui-pull-left aui-iconfont aui-icon-left icon-left-coler" tapmode onclick="closeWin()"></div>
    <div class="aui-title">
        我的消费码
    </div>
    <ul class="aui-tab-nav aui-border-t haderTitle">
        <li class="active" data-type="product" data-status="noConsume" tapmode onclick="changeCheck(this)">
            未消费(<span id="mallNumber">0</span>)
        </li>
        <li data-type="seller" data-status="consume" tapmode onclick="changeCheck(this)">
            已消费(<span id="companyNumber">0</span>)
        </li>
    </ul>
</header>

</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/jquery-1.11.3.js"></script>
<script type="text/javascript">
    apiready = function() {
        api.parseTapmode();
        var mobile = api.pageParam.mobile;
        var header = $api.dom('header');

        $api.fixIos7Bar(header);
        //$api.fixStatusBar(header);
        api.setStatusBarStyle({
            style : 'dark'
        });
        var header_h = $api.offset(header).h;
        var body_h = $api.offset($api.dom('body')).h - header_h;
        api.openFrame({
            name : 'consumeQRcodeList_frm',
            url : 'consumeQRcodeList_frm.html',
            rect : {
                x : 0,
                y : header_h,
                w : 'auto',
                h : body_h
            },
            pageParam : {
                mobile : mobile
            },
            bounces : true,
            vScrollBarEnabled : false,
            hScrollBarEnabled : false
        });
    }
    //为了在下面的热门类别可以通用，单独出来
    function changeCheck(obj) {
        $(obj).parent().find("li").removeClass("active");
        $(obj).addClass("active");
        var type = $(obj).attr("data-type");
        api.execScript({
            frameName: "consumeQRcodeList_frm",
            script: "changeContent('" + type + "')"
        })
        var status = $(obj).attr('data-status');
        api.sendEvent({
            name: 'favoriteStatus',
            extra: {
                status: status
            }
        })
    }
</script>
</html>
